ByblosPay is a mobile payment application launched by Byblos Bank SAL that gives customers the experience of quick and secure contactless payments. The solution is based on Host Card Emulation (HCE) and NFC technology enabling Byblos Bank SAL customers to perform contactless payment transactions from their mobile phones. Customers can make payments from the app at retail stores whether their device is in online or offline mode without the need to carry their physical card.

Solution: To address the issue of an outdated look and feel of the app and improve the ease of adding a new card, I redesigned the app's user interface (UI) and streamline the card addition process. By implementing a modern and visually appealing design, along with intuitive user flows, we aim to enhance the overall user experience and eliminate the difficulties faced by users in finding and executing the card addition feature. My solution focuses on combining aesthetics with functionality, ensuring a seamless and user-friendly experience for all app users.

    

I have made the app more modern and minimal look by changing
background color and making it less overwhelming and more clear to the user. This was also achieved by using the colors to where it matters which are the cards , buttons . The new design showcases the removal of the side menu and placing in the landing page to lesser the amount of clicks.

   

In Manage Cards, I have shown the cards and its details right away when viewed.

Adding a card did not give the option to scan or to add manually, it directly went to scanning and only the app asked the user if they wish to add manually which can be confusing for the user. Therefore, in this design I directly showed the user that he/she can add details manually with its details in one easy step. Moreover, the user can directly see the scanning option if wish to be used.